<template>
  <section>
    <el-table :data="jobList">
      <el-table-column type="index" label="序号"/>
      <el-table-column label="任务类型" prop="jobType.name"></el-table-column>
      <el-table-column label="详情">
        <template slot-scope="scope">
          {{scope.row.data.title}}
        </template>
      </el-table-column>
      <el-table-column label="标记" prop="mark"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <!--<el-button size="mini" type="primary" @click="toToJobBtn(scope.row)">执行</el-button>-->
          <el-button v-if="scope.row.state === 1" size="mini" type="primary" @click="toToJobBtn(scope.row)">执行</el-button>
          <span v-else-if="scope.row.state === 2">执行中……</span>
          <span v-else-if="scope.row.state === 3">已完成</span>
          <span v-else-if="scope.row.state === 4">已取消</span>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination v-show="totalPage>0" style="margin-top:10px;"
                   background
                   layout="prev, pager, next"
                   :page-count="totalPage"
                   @current-change="goPage">
    </el-pagination>
    <el-dialog :visible.sync="dialog">
      <check-items v-if="currJobType === 'examine'" :job="currJob" v-on:cancel="dialog=false"></check-items>
      <el-row v-if="currJobType === 'report' && currReportList">
        用来做报告的事儿
        <report-list :reportList="currReportList" @done="readyReportBtn"></report-list>
      </el-row>
    </el-dialog>
  </section>
</template>

<script>
  import reportList from "@/components/report/reportList";
  import checkItems from "@/components/order/checkItems";
  import DateFormat from '@/common/date-formater'
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import errHandler from '@/assets/errHandler.js'
  import Vue from 'vue'//后续添加属性，需要vue联动
  export default {
    name: "jobList",
    components: {checkItems,reportList},
    data() {
      return {
        jobList:null,
        totalPage:0,
        dialog:false,
        currJob:null,
        currJobType:'',
        currReportList:null
      }
    },
    created(){
      //获取任务列表
      this.getJobList()
    },
    watch:{
    },
    computed:{
      ...mapGetters(['department']),
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      goPage(val){
        this.getJobList(val-1)
      },
      getJobList(pageNo){
        this.fetch({name:"getJobList",data:{page:pageNo?pageNo:0,departmentId:this.department.id}})
          .then(res=>{
            console.log(res.content)
            this.jobList=res.content
            this.totalPage=res.totalPages
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      toToJobBtn(row){
        console.log(row)
        this.currJob=row
        if(row.jobTypeCode ==='examination'){
          console.log('做创建体检的事儿~')
          this.currJobType='examine'
          this.dialog=true
        }else if(row.jobTypeCode ==='issue_report'){
          console.log('做发报告的事儿')
          this.currJobType='report'
          this.toDoReportJob(row)
          this.dialog=true
        }else if(row.jobTypeCode === 'course'){
          this.createLearnerByJob(row.id)
        }
      },
      createLearnerByJob(jobId){
        this.fetch({name:"createLearnerByJob",data:{jobId}})
          .then(res=>{
            console.log(res)
            this.$message({message: '导入成功！',type: 'success'})
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      toDoReportJob(job){
        //根据当前报告任务加载该用户的可用报告
        this.getReportList(job.data.customerId)
      },
      getReportList(customerId){
        this.currReportList=null
        this.fetch({name:"getReportList",data:{customerId}})
          .then(res=>{
            console.log(res)
            this.currReportList=res.content
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      readyReportBtn(p){
        console.log('返回一个reportId',p)
        this.readyReport(this.currJob.id,p)
      },
      readyReport(jobId,reportId){
        console.log(jobId,reportId)
        this.fetch({name:"readyReport",data:{jobId,reportId}})
          .then(res=>{
            console.log(res)
            this.$message({type:'success',message:'报告就绪完毕！'})
            // this.dialog=false
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      }
    }
  }
</script>

<style scoped>

</style>
